<template>
  <div class="dropEl">
    <el-form ref="form" :rules="rules" :model="data">
      <el-form-item
        label-width="78px"
        label="任务名称"
        class="custom-form-item"
        prop="taskName"
      >
        <el-input
          v-model="data.taskName"
          placeholder="请填写任务名称"
          style="width: 55%"
        ></el-input>
      </el-form-item>
      <el-form-item
        label="任务描述"
        class="custom-form-item"
        prop="dsc"
        label-width="78px"
      >
        <el-input
          type="textarea"
          v-model="data.dsc"
          placeholder="请填写任务描述"
          style="width: 55%"
        ></el-input>
      </el-form-item>
      <!-- <el-form-item
        label-width="78px"
        label="任务类型"
        class="custom-form-item"
        prop="jobType"
      >
        <el-select
          style="width: 55%"
          v-model="data.jobType"
          placeholder="请选择任务类型"
        >
          <el-option
            v-for="f in dict.type.appraise_tasktype"
            :key="f.value"
            :label="f.label"
            :value="f.value"
          ></el-option>
        </el-select>
      </el-form-item> -->
      <el-row>
        <el-col :span="8">
          <el-form-item
            label-width="78px"
            label="任务模式"
            class="custom-form-item"
            prop="start"
          >
            <el-select
              style="width: 100%"
              v-model="data.start"
              placeholder="请选择一个起始向导"
            >
              <template v-for="f in dict.type.data_base_type">
                <el-option
                  v-if="f.raw.remark == 2"
                  :key="f.value"
                  :label="f.label"
                  :value="f.value"
                ></el-option>
              </template>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="1"> <i class="el-icon-right"></i></el-col>
        <el-col :span="8">
          <el-form-item class="custom-form-item" prop="start">
            <el-select
              multiple  
              style="width: 67%"
              v-model="data.end"
              placeholder="请选择一个结束向导"
            >
              <template v-for="f in dict.type.data_base_type">
                <el-option
                  v-if="f.raw.remark == 1"
                  :key="f.value"
                  :label="f.label"
                  :value="f.value"
                ></el-option>
              </template>
            </el-select>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
  </div>
</template>
<script>
import FormItem from "@/components/FormItem/index.vue";

export default {
  dicts: ["data_base_type", "appraise_tasktype"],
  components: {},
  props: {},
  props: ["data"],
  data() {
    return {
      rules: {
        taskName: [{ required: true, message: "任务名称", trigger: "change" }],
        start: [{ required: true, message: "请选择起始源", trigger: "change" }],
        end: [{ required: true, message: "请选择目标源", trigger: "change" }],
        jobType: [
          { required: true, message: "请选择任务类型", trigger: "change" },
        ],
      },
    };
  },
  created() {
    console.log(this.$props.data);
  },
  methods: {
    onSubmit() {},
  },
};
</script>

<style lang="scss" scoped>
.dropEl {
  width: 100%;
  margin: 30px auto;
  border: 1px solid #dcdfe6;
  padding: 40px;
}

.el-col-1 {
  margin-top: 5px !important;
  text-align: center;
}
</style>
